<template>
  <view style="padding: 10px;display: flex;flex-direction: column;">
    <view style="margin-top: 10px;">获取到的code：
      <textarea v-model="code" auto-height class="input-view"></textarea>
    </view>
    <button size="mini" style="margin-top: 10px;" @click="copyValue">复制Code</button>
    <view class="card-layout">
      <view>获取到的实名信息</view>
      <view>姓名：{{ msbInfo.real_name }}</view>
      <view>手机：{{ msbInfo.mobile_phone }}</view>
      <view v-for="(item,index) in stepList" :key="index" style="font-size: smaller;color: orangered">
        {{ item }}
      </view>
    </view>
    <button size="mini" type="primary" @click="getMsbCode" style="margin-top: 10px;">调用获取实名认证信息</button>
    <view style="margin-top: 40px;">let scope = "base_info,auth_user"</view>
    <button size="mini" @click="toLogin" style="margin-top: 10px;">再次获取实名认证code</button>
    <button size="mini" @click="toHome" style="margin-top: 10px;">回到首页</button>
    <view class="hint-layout">
      <view>
        1.这里用到了hlwyy的接口：因为实名认证的流程中请求蒙速办接口的参数需要通过java代码进行sign签名
      </view>
      <view style="margin-top: 10px">
        2.这里用到了uniCloud的com-power的公共接口(在axios里面已经配置了)，因为蒙速办打开的应用中请求接口需要使用https的协议
      </view>
    </view>
  </view>
</template>

<script>
import smrz from "../../plugin/smrz"

export default {
  data() {
    return {
      stepList: [],
      app_id: "",
      // code: "8b74ec46-8212-4d81-a0ee-79d52b2c435e",//todo 本地测试需要删除
      code: "",//todo 本地测试需要删除
      scope: "",
      msbInfo: {
        real_name: '',
        mobile_phone: '',
      },
    }
  },
  onLoad() {
    if (this.code) return //todo 测试代码需要删除
    let routes = getCurrentPages(); // 获取当前打开过的页面路由数组
    let curRoute = routes[routes.length - 1].route //获取当前页面路由
    let curParam = routes[routes.length - 1].options; //获取路由参数
    console.log("curRoute", curRoute)
    console.log("curParam", curParam)
    let {
      app_id,
      code,
      scope
    } = curParam
    this.app_id = app_id
    this.code = code
    this.scope = scope
    this.getToken()
    this.$store.commit('SET_AUTH_LOGIN')
    // alert("this.$store.state.authLogin"+this.$store.state.authLogin)
  },
  methods: {
    getMsbCode() {
      this.stepList = []
      smrz.getMsbUser(this.code, (backRes) => {
        this.stepList.push(backRes)
      }).then(res => {
        console.log("getMsbCode", res)
        this.msbInfo = res
      }).catch(err => {
        uni.showToast({title: "获取实名认证信息失败！"})
      })
    },
    toHome() {
      uni.navigateTo({
        url: "/pages/index/index"
      })
    },
    copyValue() {
      uni.setClipboardData({
        data: this.code, //要被复制的内容
        success: () => { //复制成功的回调函数
          uni.showToast({ //提示
            title: '复制成功'
          })
        }
      });
    },
    getToken() {
      uni.request({
        url: "https://app.zwfw.nmg.gov.cn:4443/icity/auth2.0/token",
        data: {
          app_id: 'c1ae62fe-9cb8-4fb9-9ba7-ad1ae0a4ad34',
          code: this.code,
          grant_type: "authorization_code",
          sign: ""
        },
        header: {
          'Content-Type': 'application/x-www-form-urlencoded'
        },
        method: "POST",

      })
    },
    toLogin() {
      let base_url = "https://app.zwfw.nmg.gov.cn:4443/icity/auth2.0/authorize"
      let app_id = "c1ae62fe-9cb8-4fb9-9ba7-ad1ae0a4ad34"
      let redirect_uri = "https://m.zhaoyj.work/msb/#/pages/login/result"
      // let redirect_uri = "https://app.zwfw.nmg.gov.cn/mengsuban-doc-online/index.html"
      let scope = "auth_user"
      let state = ""
      this.weburl =
          `${base_url}?app_id=${app_id}&redirect_uri=${encodeURIComponent(redirect_uri)}&scope=${scope}&state=${state}`
      console.log("weburl====", this.weburl)
      window.location = this.weburl
    }
  }
}
</script>

<style>
.card-layout {
  display: flex;
  flex-direction: column;
  margin: 10px;
  background: #eaeaea;
  border-radius: 5px;
  padding: 4px;
}

.hint-layout {
  padding: 10px;
  font-size: smaller;
  background: lightblue;
  border-radius: 5px;
  margin-top: 30px;
}

.hint-layout > * {
  color: lightslategray;
}

.input-view {
  width: 97%;
  font-size: small;
  margin-top: 10px;
  padding: 5px 8px;
  border-radius: 5px;
  border: 1px solid #eaeaea;
}
</style>
